<template>
    <div class="list tile-table">
        <TileItem v-for="item in data" :key="item.id" :data="item" @click="itemClick(item)"/>
    </div>
</template>
<script>
import { toRefs } from '@vue/reactivity'
import TileItem from './TileItem.vue'
export default {
    components:{TileItem},
    props:['data'],
    emits:['click'],
    setup(props,context) {
        const state = props
        const itemClick = (item)=>{
            context.emit('click',item)
        }
        return {
            ...toRefs(state),
            itemClick
        }
    },
}
</script>
<style lang="less" scoped>
.list {
    display: flex;
    flex-wrap: wrap;
}
</style>